给你的WebView 添加手势控制—你这样玩过吗
手把手教你撸一个自定义GestureOverlayView ，给你的WebView 添加手势控制
一杯刘的博客地址：
http://www.jianshu.com/p/19c694450aba
这两天做了个小项目，其中客户需求就是在 webview 中添加手势控制，比如说画个 L 返回上一级之类的，就像这样：
上图就是这次的 Demo 的效果 Talk is cheap,show me the code
GestureOverlayView 的使用
这东西就是本次的主角了，一个继承 FrameLayout 的 view，他可以接收你的手势，并通过监听接口判断出你所画的手势和预定的手势是否相同，直接上代码吧，在 XML 文件里 like this
<android.gesture.GestureOverlayView
android:id="@+id/gestureview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gestureColor="@color/colorAccent"
android:uncertainGestureColor="@color/colorPrimary">
<WebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.gesture.GestureOverlayView>我们把 WebView 包裹起来，让她感受男人的温暖，然后，在 MainActivity 中调用 initGestureOverlay()
// 我把全局变量拿出来方便大家看private GestureOverlayView mGestureview;private GestureLibrary mGestureLib;private void initGestureOverlay() { //从 raw 文件夹里取出我们预制的手势文件
mGestureLib = GestureManager.getInstance(getBaseContext()).getGestureLib(); //设置笔画为单笔，也就是一笔画
mGestureview.setGestureStrokeType(GestureOverlayView.GESTURE_STROKE_TYPE_SINGLE); //画完笔画后到消失的间隔
mGestureview.setFadeOffset(0); //笔画粗细
mGestureview.setGestureStrokeWidth(15); //重点啊啊啊，设置 GestureOverlayView 不拦截触摸事件，
// 不设置的话，webview 是没法相应我们的滑动事件的
mGestureview.setEventsInterceptionEnabled(false); //精髓接口，通过他我们可以判断用户的手势是不是我们想接收的手势
mGestureview.addOnGesturePerformedListener(new GestureOverlayView.OnGesturePerformedListener() {
@Override
public void onGesturePerformed(GestureOverlayView overlay, Gesture gesture) { //recognize()方法接收用户的手势，并返回手势库中和该手势相匹配的手势
ArrayList<Prediction> predictions = mGestureLib
.recognize(gesture);
if (predictions.size() > 0) { //我们取最最相似的那个手势
//prediction 里面就是我们预制的 手势名称 和 相匹配的分值 两个变量
Prediction prediction = (Prediction) predictions.get(0); //如果分数大于 1.0 并且 匹配出来的手势名称是我们预制的 “back” 字符串
if (prediction.score > 1.0 && prediction.name.equals("back")) {
if (mWebview.canGoBack()) { //webview 回退上一级
mWebview.goBack();
} else {
Toast.makeText(MainActivity.this, "已经是首页啦", Toast.LENGTH_SHORT).show();
}
}
}
}
});
}这样我们就能控制通过手势控制 webview 的返回啦，当然手势的监听在这里，你想干啥都行
修改手势
我不说话，就上图
恩，我们把 L 改成向右滑，其实改手势也没啥，就是把 raw 文件夹下的手势库文件更新一下就行
public void changeBackGesture(Gesture gesture){
mGestureLib.removeEntry("back");
mGestureLib.addGesture("back", gesture);
Toast.makeText(mContext, "成功了，快去试试吧", Toast.LENGTH_SHORT).show();
}把我们改好的手势 Gesture 传进来，通过 GestureLibrary 修改一下就好了，那怎么获取这么手势呢？
mEditoverlay.addOnGestureListener(new GestureOverlayView.OnGestureListener() { @Override
public void onGestureStarted(GestureOverlayView overlay, MotionEvent event) {
} @Override
public void onGesture(GestureOverlayView overlay, MotionEvent event) {
} @Override
public void onGestureEnded(GestureOverlayView overlay, MotionEvent event) {
mGesture = overlay.getGesture();
} @Override
public void onGestureCancelled(GestureOverlayView overlay, MotionEvent event) {
}
});我们通过这个 OnGestureListener() 接口来获取手势完成时的手势，传给刚才的方法就行了
手势库
说了半天，raw 下面的这个手势库是啥啊，恩，你记不记得
mGestureLib = GestureLibraries.fromRawResource(mContext, R.raw.gestures);
他制定了一个手势库的位置让 GestureLibraries 去加载，GestureLibraries 也可以从文件中获取
GestureLibraries.fromFile()
位置你可以自己指定，什么？你问我 Demo 里的 Gesture 文件怎么来的？我会告诉你我生成了一个放进 raw 里面的吗，啊哈哈哈哈...
demo地址：
https://github.com/yibeiliu/GestureOverlayViewDemo
博客地址:
http://www.jianshu.com/p/19c694450aba
终端研发部提倡： 没有做不到的，只有想不到的。
在这里获得的不仅仅是技术！
这里学到的不仅仅